<html>
<head>
    <title>History - Computer Site</title>

    <style type="text/css">
	ul#list-nav {
	list-style:none;
	margin:0px;
	padding:0;
	width:905px
	}
	ul#list-nav li {
	:inline
	}
	ul#list-nav li a {
	text-decoration:none;
	padding:2px 0;
	width:180px;
	background:#CF4711;
	color:#eee;
	float:left;
	text-align:center;
	border-left:1px solid #000000;
	}
	ul#list-nav li a:hover {
	background:#a2b3a1;
	color:#000
	}
    </style>
</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">	
<div align="center">
	<table border="0" cellpadding="0" cellspacing="0" width="900" height="100%" bgcolor="white">
		<tr>
			<td width="906" height="616" colspan="4" valign="top">
		<table border="0" cellpadding="10" cellspacing="0" width="905" height="30">
		<tr>
			<td width="900" bgcolor="#000000">
				<span style="background-color: #000000"><font color="#CF4711" face="Tahoma">
				Computer Lab Management Cpr.E KMUTNB </font><font color="#808080" face="Tahoma">| </font>
				<font color="#FFFFFF" face="Tahoma"> Computer Submit</font></span></td>
		</tr>
	</table>
	<ul id="list-nav">
		<li><a href="http://127.0.0.1:8000/">Home</a></li>
		<li><a href="http://127.0.0.1:8000/add/">Computer Submit</a></li>
		<li><a href="http://127.0.0.1:8000/report/">Report</a></li>
		<li><a href="http://127.0.0.1:8000/fix_com/">Fixtable</a></li>
		<li><a href="#">History</a></li>
	</ul>
	<fieldset>
	<legend><pre>Bar graph</pre></legend>
	
	<pre><center> Show history of submit for each computer </center></pre>
	
	<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
	
	xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" height="500px">

  	<line x1="70" y1="15" x2="70" y2="460" style="stroke:rgb(255,0,0);stroke-width:3"/>  
	<line x1="70" y1="460" x2="800" y2="460" style="stroke:rgb(255,0,0);stroke-width:3"/>
	<text x="29" y="10" fill="black" font-size="13">Submit_time</text>
	<text x="810" y="460" fill="black" font-size="13">Com_ip</text>

	{% for i in list_x %}
	    <text x="{{ i.xpos }}" y="490" fill="black" font-size="13">{{ i.com_ip }}</text>  
	    <line x1="{{ i.x_start }}" y1="{{ i.submit_time }}" x2="{{ i.x_start }}" y2="460" style="stroke:violet;stroke-width:20"/>  
	      
	{% endfor %}

	{% for j in list_y %}
	    <text x="30" y="{{ j.y_start }}" fill="black" font-size="12">{{ j.count }}</text>
	    <line x1="60" y1="{{ j.line }}" x2="70" y2="{{ j.line }}" style="stroke:blue;stroke-width:2"/>
	    
	{% endfor %}
	 
	</svg>

	</fieldset>
	<fieldset>
		<legend><pre>Log out</pre></legend>
			<pre>Click here to logout. <a href="http://127.0.0.1:8000/logout/">Log out</a></pre>
	</fieldset>
</div>
</body>
</html>
	
